.loginForm {
  background-color: var(--white-color);
  padding: rem(32) rem(24);
  border-radius: $border-radius-md;
  box-shadow: $box-shadow-md;
  @include breakpoint('sm', 'md') {
    padding: rem(16);
    box-shadow: none;
    border-radius: 0;
  }

  label {
    color: var(--text-color);
  }

  input {
    color: var(--text-color);
    border-color: var(--gray-color);
    &:hover {
      border-color: var(--secondary-color);
    }
  }

  .errorMessage {
    color: var(--danger-primary-color);
  }
  .revealButton {
    background-color: transparent;
    &:hover {
      background-color: transparent;
    }
    svg {
      fill: var(--text-color);
    }
  }
}


.darkLoginText {
  color: var(--primary-color) !important;
}